<extend name="Public:base"/>

<block name="body">
    <style type="text/css">

        #body {

            width: 95%;

            background: white;

            border-radius: 10px;

            margin: 2.5%;

            position: relative;

        }

        .add_button {
            margin: 20px 30px;
            height: 40px;
            width: 80px;
        }

        .top_input_button {

            width: 300px;

            height: 42px;

        }

        .btn-default {

            color: #fff;

            background-image: none;

            background-color: rgba(255, 150, 47, 1);

            border: none;

        }

        .btn-default:focus, .btn-default:hover {

            color: #fff;

            background-image: none;

            border: none;

            background-color: rgba(255, 150, 47, 1);

        }

        tr > td > span {

            margin: 5px;

            color: #00aaee;

        }

        thead > tr > th {

            text-align: center;

        }

        #data_tr > td {

            text-align: center;

        }

    </style>
    <div id="body">

        <button type="button" data-toggle="modal" data-target="#myModal" class="btn btn-default add_button ">添加</button>
        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">添加</h4>
                    </div>
                    <div class="modal-body">
                        <form action="" enctype="multipart/form-data" onsubmit="return false">
                            <div class="input-group input-group-lg">
                                <span class="input-group-addon">项目名称</span>
                                <input type="text" class="form-control" id="name" aria-describedby="sizing-addon1">
                            </div>
                            <p style="text-align: center">
                                <button type="button" data-dismiss="modal" class="btn add_button ">取消</button>
                                <button type="button" id="add_one_code" class="btn btn-default add_button ">添加</button>
                            </p>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div style="position: absolute;right: 115px;top:20px">
            <input type="text" id="like_code" class="form-control top_input_button" placeholder="请输入活动项目名称" aria-describedby="sizing-addon1">
        </div>

        <div style="position: absolute;right: 20px;top:0">
            <button type="button" id="like" class="btn btn-default  add_button" style="width: 60px">查询</button>
        </div>

        <div class="row" style="margin-left: 15px;width: 97%">
            <div class="col-xs-12">
                <table class="table table-striped table-bordered">
                    <thead>
                        <tr>
                            <th>编号</th>
                            <th>项目名称</th>
                            <th>活动数量</th>
                            <th>参与总人数</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                    <volist name="data" id="vo">
                        <tr id="data_tr" style="overflow: hidden">
                            <td>{$vo.id}</td>
                            <td>{$vo.name}</td>
                            <td>{$vo.project_total}</td>
                            <td>{$vo.user_total}</td>
                            <td>
                                <span onclick="group_table('{$vo.id}','edit')">编辑</span>
                                <span onclick="group_table('{$vo.id}','auth')">活动列表 </span>
                            </td>
                        </tr>
                    </volist>
                    </tbody>
                </table>
                {$page}
                <!-- PAGE CONTENT ENDS -->
            </div><!-- /.col -->
        </div>
    </div>

    <script>

        $('#add_one_code').click(function () {
            var name=$('#name').val();
            if(name === ''){
                return false;
            }
            $.post('index',{name:name,type:'add'},function (res) {
                if(res.code){
                    bootbox.alert({
                        title:'系统提示',
                        message:res.msg
                    });
                    setTimeout(function () {
                        window.location.reload();
                    },2000)
                }else {
                    bootbox.alert({
                        title:'系统提示',
                        message:res.msg
                    })
                }
            })
        });

        function group_table(id, event) {
            if (event === 'edit') {
                $.post('index',{id:id,type:'edit'},function (res) {
                    bootbox.dialog({
                        message: '<div class="input-group input-group-lg">' +
                            '<span class="input-group-addon" id="sizing-addon1">项目名称</span>' +
                            '<input type="text" class="form-control" id="edit_name" value="'+res.name+'" aria-describedby="sizing-addon1">' +
                            '</div>',
                        title: "编辑",
                        buttons: {
                            success: {
                                label: "关闭",
                                className: "btn-danger",
                                callback: function() {}
                            },
                            "Danger": {
                                label: "确认",
                                className: "btn-success",
                                callback: function() {
                                    var name=$('#edit_name').val();
                                    var id=res.id;
                                    $.post('index',{name:name,id:id,type:'edit'},function (res) {
                                        if(res.code){
                                            bootbox.alert({
                                                title:'系统提示',
                                                message:res.msg
                                            });
                                            setTimeout(function () {
                                                window.location.reload();
                                            },2000)
                                        }else {
                                            bootbox.alert({
                                                title:'系统提示',
                                                message:res.msg
                                            })
                                        }
                                    })
                                }
                            }
                        }
                    });
                });

            } else if (event === 'auth') {
                window.location.href="data.html?id="+id;
            }
        }

        $('#like').click(function () {
            like = $('#like_code').val();
            window.location.href = '{:U("Dxadmin/project/index")}?like=' + like;
        })

    </script>

</block>